<template>
  <a-descriptions
    size="large"
    :data="dataSource"
    bordered
    :label-style="{
      'font-size': '16px',
    }"
    :value-style="{
      'font-size': '16px',
    }"
    title=""
    layout="inline-horizontal"
  />
</template>

<script lang="ts">
  import { defineComponent, ref } from 'vue';
  import { getPatient } from '@/api/detail';
  import { Message } from '@arco-design/web-vue';

  export default defineComponent({
    props: {
      id: {
        type: [String, Number, Array],
        default: 0,
      },
    },
    setup: (porps) => {
      const dataSource = ref([
        {
          label: '患者姓名：',
          value: '',
          keyName: 'nickName',
        },
        {
          label: '身高(cm)：',
          value: '',
          keyName: 'userHeight',
        },
        {
          label: '体重(Kg)：',
          value: '',
          keyName: 'userWeight',
        },
        {
          label: '出生日期：',
          value: '',
          keyName: 'dateOfBirth',
        },
        {
          label: '身份证号：',
          value: '',
          keyName: 'idNumber',
        },
        {
          label: '联系电话：',
          value: '',
          keyName: 'phonenumber',
        },
        {
          label: '家庭住址：',
          value: '',
          keyName: 'homeAddress',
        },
        {
          label: '紧急联系人：',
          value: '',
          keyName: 'emergencyContact',
        },
        {
          label: '紧急联系人电话：',
          value: '',
          keyName: 'emergencyContactPhone',
        },
      ]);
      getPatient({
        id: porps.id,
      }).then(({ code, data, msg }) => {
        if (code !== 200) {
          Message.error(msg);
        }
        if (data.length <= 0) {
          Message.warning('没有查询到该用户的数据');
          return;
        }
        for (let i = 0; i < dataSource.value.length; i += 1) {
          dataSource.value[i].value = data[0][dataSource.value[i].keyName];
        }
      });
      return {
        dataSource,
      };
    },
  });
</script>

<style lang="less" scoped>
  :deep(.arco-descriptions-title) {
    font-size: 18px;
  }
</style>
